<template>
  <div class="submitOk">
    <NavBar @goBack="goBack" :title="title"></NavBar>
    <van-cell title="Submit Success！" :icon="icon_Success" />
    <div class="okBtn">
      <van-button @click="goBack" type="primary" size="large">OK</van-button>
    </div>
  </div>
</template>
<script>
import NavBar from '@/components/NavBar'
export default {
  name: 'submitOk',
  components: {
    NavBar
  },
  data() {
    return {
      title: 'ZegoExpress',
      icon_Success: require('../../assets/image/icon_Success.png')
    }
  },
  created() {
    // https://www.jianshu.com/p/539e2dfb0a65
    window.addEventListener('popstate', this.popstate, false)
  },
  mounted() {
    window.history.pushState(null, null, document.URL)
  },
  destroyed() {
    window.removeEventListener('popstate', this.popstate, false)
  },
  methods: {
    popstate() {
      //禁止浏览器的前进与后退
      window.history.forward(-1)
    },
    goBack() {
      this.$router.replace({
        path: '/main'
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.submitOk {
  width: 100%;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #ffffff;
  .van-cell {
    margin-top: 40px;
    margin-bottom: 60px;
    flex-direction: column;
    align-self: center;
    align-items: center;

    i {
      font-size: 34px;
      margin-bottom: 28px;
    }
    .van-cell__title {
      font-size: 18px;
      font-weight: 700;
    }
  }
  /deep/ .van-cell::after {
    border-bottom: none;
  }
  .okBtn {
    box-sizing: border-box;
    padding-left: $padd;
    padding-right: $padd;
    /deep/ .van-button--large {
      background-color: $main-color;
      color: #ffffff;
      border: none;
    }
  }
}
</style>
